import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

import './assets/iconfont.css'
import 'lib-flexible/flexible'

// 导入axios模块
import axios from 'axios'
import VueAxios from 'vue-axios'
//图标引入
import "../src/assets/css/iconfont.css"

// import { createApp } from 'vue';


Vue.use(VueAxios, axios)
// import axios from "axios"
//基于axios的vue-axios
// import VueAxios from "vue-axios"

//引入组件也可以封装成一个函数
// import getVants from './components/plugins'
// const app = createApp(App)
// getVants(app)


//从vant组件库导入图标组件
import {
     Icon,
     Search,
     PullRefresh,
     Tab, Tabs,
     Swipe, SwipeItem ,
     Tabbar, TabbarItem,
     Sidebar,SidebarItem,
     Slider,
     NavBar,
     Toast,
     Button,
     Popup,
     Form,
     Field,
     Loading
  } from 'vant';

//全局注册
Vue
.use(Sidebar)
.use(SidebarItem)
 .use(Icon)
 .use(Search)
 .use(Tab)
 .use(Tabs)
  .use(Swipe)
  .use(SwipeItem)
  .use(Tabbar)
  .use(TabbarItem)
  .use(PullRefresh)
  .use(NavBar)
  .use(Toast)
  .use(Slider)
  .use(Button)
  .use(Popup)
  .use(Form)
  .use(Field)
  .use(Loading);
;

// Vue.config.productionTip = false
//注册vue-axios,就可以使用组件实例化去调用axios 用的时候直接this.axios()
//参数有很多
// Vue.use(VueAxios,axios)
// import { Tabbar, TabbarItem } from 'vant';
// Vue.use(Tabbar);
// Vue.use(TabbarItem);

// import { Button } from 'vant';

// Vue.use(Button);

//路由是否需要登录权限
router.beforeEach(function(to,from,next){
  if (to.meta.needLogin) {
     //页面是否登录
     if (localStorage.getItem("token")) {
        //本地存储是否有token(uid)数据
        next(); //表示已经登录
     }else{
      //next可以传递一个路由对象作为参数 表示需要跳转的页面
      next({
        name:"my"
      });
     }
  }else{
   //表示不需要登录
   next(); //继续往后走
  }
});

Vue.config.productionTip = false

axios.defaults.baseURL = 'https://apis.netstart.cn/music';

// 添加请求拦截器
axios.interceptors.request.use(function (config) {
  // 在发送请求之前做些什么
  Toast.loading({
    message: '加载中...',
    //禁止穿透点击
    forbidClick: true,
    //展示时长(ms)，值为 0 时，toast 不会消失请求成功后再关闭它
    duration:0,
  });
  return config;
}, function (error) {
  // 关闭方法 错误的时候关闭
  Toast.clear()
  // 对请求错误做些什么
  return Promise.reject(error);
});

// 添加响应拦截器
axios.interceptors.response.use(function (response) {
  // 2xx 范围内的状态码都会触发该函数。
  // 对响应数据做点什么
  // 这里成功也可以关闭
  Toast.clear()
  return response;
}, function (error) {
  // 超出 2xx 范围的状态码都会触发该函数。
  // 对响应错误做点什么
  Toast.clear();
  return Promise.reject(error);
});

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')
